<template>
    <div class="box">
        <div class="header-top">
            <router-link to="withdraw">
                <img src="../../assets/images/fanhui.png" alt="" class="bank">
            </router-link>
            <h3>提现记录</h3>
            <div class="tixian"></div>
        </div>
        <div class="withdrawal_time">
            <img src="../../assets/images/zhong.png" alt="" class="time_icon">
            <div class="times">
                <h3>10-28</h3>
                <div>2018</div>
            </div>
            <div class="times1">
                <h3>08-07</h3>
                <div>2018</div>
            </div>
            <div class="times2">
                <h3>05-20</h3>
                <div>2018</div>
            </div>
            <div class="times3">
                <h3>05-20</h3>
                <div>2018</div>
            </div>
            <div class="times4">
                <h3>05-20</h3>
                <div>2018</div>
            </div>
            <div class="long_string"></div>
            <img src="../../assets/images/yuan.png" alt="" class="yuan1">
            <img src="../../assets/images/yuan.png" alt="" class="yuan2">
            <img src="../../assets/images/yuan.png" alt="" class="yuan3">
            <img src="../../assets/images/yuan.png" alt="" class="yuan4">
            <img src="../../assets/images/yuan.png" alt="" class="yuan5">

            <div class="Data_text1">
                <div class="er">20元</div>
                <div class="yi">已提现</div>
                <div class="yu">余额提现</div>
            </div>
            <div class="Data_text2">
                <div class="er">20元</div>
                <div class="yi">已提现</div>
                <div class="yu">余额提现</div>
            </div>
            <div class="Data_text3">
                <div class="er">20元</div>
                <div class="yi">已提现</div>
                <div class="yu">余额提现</div>
            </div>
            <div class="Data_text4">
                <div class="er">20元</div>
                <div class="yi">已提现</div>
                <div class="yu">余额提现</div>
            </div>
            <div class="Data_text5">
                <div class="er">20元</div>
                <div class="yi">已提现</div>
                <div class="yu">余额提现</div>
            </div>
        </div>
    </div>
</template>

<script setup>

</script>

<style lang="scss" scoped>
    .box{
        width: 120%;
        height: 80vh;
        margin-left: -30px;
        margin-top: -20px;
        position: relative;
        .header-top{
            width: 100%;
            height: 40px;
            .bank{
                width: 25px;
                height: 25px;
                margin: 5px 10px;
            }
            h3{
                position: absolute;
                top: 5px;
                left: 150px;
                font-weight: 600;
            }
            .cha{
                position: absolute;
                right: 10px;
                top: 7px;
                font-weight: 600;
                font-size: 14.2px;
            }
            .tixian{
                width: 372x;
                height: 10px;
                background-color: #f6f2f2;
            }
        }
        .withdrawal_time{
            width: 100%;
            height: 605px;
            position: relative;
            top: -5px;
            // border: solid 1px #000;
            .time_icon{
                position: absolute;
                width: 30px;
                height: 30px;
                left: 80px;
                top: 40px;
            }
            .times{
                width: 60px;
                height: 60px;
                position: absolute;
                top: 80px;
                left: 10px;
                h3{
                    font-weight: 500;
                    float: right;
                }
                div{
                    float: right;
                }
            }
            .times1{
                width: 60px;
                height: 60px;
                position: absolute;
                top: 195px;
                left: 10px;
                h3{
                    font-weight: 500;
                    float: right;
                }
                div{
                    float: right;
                }
            }
            .times2{
                width: 60px;
                height: 60px;
                position: absolute;
                top: 300px;
                left: 10px;
                h3{
                    font-weight: 500;
                    float: right;
                }
                div{
                    float: right;
                }
            }
            .times3{
                width: 60px;
                height: 60px;
                position: absolute;
                top: 410px;
                left: 10px;
                h3{
                    font-weight: 500;
                    float: right;
                }
                div{
                    float: right;
                }
            }
            .times4{
                width: 60px;
                height: 60px;
                position: absolute;
                top: 530px;
                left: 10px;
                h3{
                    font-weight: 500;
                    float: right;
                }
                div{
                    float: right;
                }
            }
            .long_string{
                width: 0.5px;
                height: 550px;
                position: absolute;
                left: 94px;
                top: 70px;
                border: solid 1px #e2e0e0;
            }
            .yuan1{
                width: 20px;
                height: 20px;
                position: absolute;
                left: 84px;
                top: 95px;
            }
            .yuan2{
                width: 20px;
                height: 20px;
                position: absolute;
                left: 84px;
                top: 210px;
            }
            .yuan3{
                width: 20px;
                height: 20px;
                position: absolute;
                left: 84px;
                top: 320px;
            }
            .yuan4{
                width: 20px;
                height: 20px;
                position: absolute;
                left: 84px;
                top: 430px;
            }
            .yuan5{
                width: 20px;
                height: 20px;
                position: absolute;
                left: 84px;
                top: 540px;
            }
            .Data_text1{
                width: 220px;
                height:80px;
                border: solid 1px #c7c7c7;
                position: relative;
                left: 130px;
                top: 70px;
                border-radius: 10px;
                .er{
                    position: absolute;
                    top: 5px;
                    left: 20px;
                    color: #d92109;
                    font-weight: 500;
                }
                .yi{
                    position: absolute;
                    top: 40px;
                    left: 15px;
                    color: #3488e9;
                }
                .yu{
                    position: absolute;
                    right: 10px;
                    top: 5px;
                    font-size: 13px;
                    color: #6f6f6f;
                }
            }
            .Data_text2{
                width: 220px;
                height: 80px;
                border: solid 1px #c7c7c7;
                position: relative;
                left: 130px;
                top: 100px;
                border-radius: 10px;
                .er{
                    position: absolute;
                    top: 5px;
                    left: 20px;
                    color: red;
                    font-weight: 500;
                }
                .yi{
                    position: absolute;
                    top: 40px;
                    left: 15px;
                    color: rgba(19, 83, 234, 0.886);
                }
                .yu{
                    position: absolute;
                    right: 10px;
                    top: 5px;
                    font-size: 13px;
                    color: #757575;
                }
            }
            .Data_text3{
                width: 220px;
                height: 80px;
                border: solid 1px #c7c7c7;
                position: relative;
                left: 130px;
                top: 130px;
                border-radius: 10px;
                .er{
                    position: absolute;
                    top: 5px;
                    left: 20px;
                    color: red;
                    font-weight: 500;
                }
                .yi{
                    position: absolute;
                    top: 40px;
                    left: 15px;
                    color: rgba(19, 83, 234, 0.886);
                }
                .yu{
                    position: absolute;
                    right: 10px;
                    top: 5px;
                    font-size: 13px;
                    color: #757575;
                }
            }
            .Data_text4{
                width: 220px;
                height: 80px;
                border: solid 1px #c7c7c7;
                position: relative;
                left: 130px;
                top: 160px;
                border-radius: 10px;
                .er{
                    position: absolute;
                    top: 5px;
                    left: 20px;
                    color: red;
                    font-weight: 500;
                }
                .yi{
                    position: absolute;
                    top: 40px;
                    left: 15px;
                    color: rgba(19, 83, 234, 0.886);
                }
                .yu{
                    position: absolute;
                    right: 10px;
                    top: 5px;
                    font-size: 13px;
                    color: #757575;
                }
            }
            .Data_text5{
                width: 220px;
                height: 80px;
                border: solid 1px #c7c7c7;
                position: relative;
                left: 130px;
                top: 190px;
                border-radius: 10px;
                .er{
                    position: absolute;
                    top: 5px;
                    left: 20px;
                    color: red;
                    font-weight: 500;
                }
                .yi{
                    position: absolute;
                    top: 40px;
                    left: 15px;
                    color: rgba(19, 83, 234, 0.886);
                }
                .yu{
                    position: absolute;
                    right: 10px;
                    top: 5px;
                    font-size: 13px;
                    color: #757575;
                }
            }
        }
    }
</style>